<!DOCTYPE html>
{% load static %}
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>Image Process</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
    <link rel="stylesheet"  href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
      <link rel="stylesheet" href="{% static 'css/style.css' %}">
<link rel="stylesheet" href="{% static 'css/style_select.css' %}">

</head>
<body>
<!-- partial:index.partial.html -->
<div class="container">

		<div class="selected-item">
			<p>You Selected Function : <span>Select</span></p>
		</div>

        <form action="/process_image" enctype="multipart/form-data" method="post">
            {% csrf_token %}
{#            <select name="select_name" id="cusSelectbox">#}
{#                <option value="func1">等比缩放</option>#}
{#                <option value="func2">直方图均衡</option>#}
{#                <option value="func3">添加随机噪声</option>#}
{#                <option value="func4">高斯滤波器</option>#}
{#                <option value="func5">中值滤波</option>#}
{#                <option value="func6">倒吸一口冷气</option>#}
{#            </select>#}
            <select name="select_name" id="cusSelectbox">
                <option value="等比缩放">等比缩放</option>
                <option value="添加椒盐噪声">添加椒盐噪声</option>
                <option value="添加随机噪声">添加随机噪声</option>
                <option value="高斯滤波器">高斯滤波器</option>
                <option value="中值滤波">中值滤波</option>
                <option value="blur">blur</option>
                <option value="GaussianBlur">GaussianBlur</option>
                <option value="medianBlur">medianBlur</option>
                <option value="fastNlMeans">fastNlMeans</option>
                <option value="bilateral">bilateral</option>
            </select>
            <button type="submit" >提交</button>
		</form>

		<div class="feaBlock">
			<ol>
				<li>        在列表中选择一种处理图像的方法.</li>
				<li>        点击右侧提交按钮</li>
				<li>        下方会显示处理结果</li>
				<li>        (ง •_•)ง</li>
			</ol>
		</div>

	</div>

    <div class="main-main">
        <div>
{#       {% static save_path %}#}
{#      <img src="{% static 'images/test2.jpg' %}" alt="">#}
{#       <img src="suanfa_sapp + {% static save_path %}" alt="" >#}
{#       need_path：{{need_path}}#}
            <h5 align="center">峰值信噪比(pnsr)：{{ pnsr }} </h5>
            <h5 align="center">结构相似性(ssim)：{{ ssim }}</h5>
            <h5 align="center">均方误差(mse)：{{ mse  }}</h5>
             <div>
                 <img src="{% static need_path %}" alt="" >
            </div>

{#       <img src="{% static path %}" alt="" style="width: 1024px;height:800px">#}
        </div>


   </div>
<!-- partial -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script  src="{% static 'js/script_select.js' %}"></script>

</body>
</html>